<template>
	<view>
		<remind-carinfo :dataBean="dataBean"></remind-carinfo>

		<view class="item" style="padding: 0 20rpx;">

			<u-icon name="order" color="#1573FF" label="处置信息" label-color="#333333"
				:customStyle="{'line-height': '80rpx','display': 'block','padding-left':'20rpx',}"></u-icon>

			<u-line color="#efefef" :customStyle="{'margin-bottom': '10rpx','display': 'block',}"></u-line>

			<u-form :model="addbean" ref="uform" label-width="auto">

				<u-form-item label="处置原因" @click="pickerShow(1)" borderBottom required>
					<u--input v-model="reasonName" disabled disabledColor="#ffffff" border="none" inputAlign="right"
						placeholder="请选择处置原因" type="select" :select-open="actionSheetShow">
					</u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>

				<u-form-item label="处置时间" @click="pickerShow(2)" borderBottom required>
					<u-input v-model="addbean.disposalTime" disabled disabledColor="#ffffff" border="none"
						inputAlign="right" placeholder="请选择处置时间" type="select" :select-open="actionSheetShow">
					</u-input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>

				<u-form-item label="备注" borderBottom>
					<u-input v-model="addbean.remark" inputAlign="right" border="none" placeholder="请输入备注">
					</u-input>
				</u-form-item>

				<text style="padding: 20rpx 0; display: block;font-size: 30rpx;color: #333;">附件</text>

				<lr-upload ref="upload1" @on-change='onListChange' :tag="1" :objType="23"></lr-upload>

			</u-form>
		</view>

		<examflow :from="pageType" :instanceId="instanceId" approvalName="carDisposalApprove" :isAdd="'add'==pageType">
		</examflow>

		<!-- 原因 -->
		<u-picker :show="reasonShow" :columns="reasonList" keyName="value" @confirm="pickerConfim"
			@cancel="reasonShow=false"></u-picker>

		<!-- 时间 -->
		<u-datetime-picker :show="timeShow" mode="date" @confirm="timeconfirm" @cancel="timeShow=false">
		</u-datetime-picker>

		<view style="height: 100rpx;"></view>

		<view class="button-container">
			<button class="btn-item" @click="commit">提 交</button>
		</view>

	</view>
</template>

<script>
	import remindCarinfo from '@/components/remind-carinfo.vue';
	import lrUpload from '../../components/global/lr-upload.vue';
	import examflow from '@/components/exam-flow.vue';
  import {isVideo} from "@/common/calc";
	export default {
		components: {
			remindCarinfo,
			lrUpload,
			examflow
		},
		data() {
			return {
				pageType: '',
				carId: '',
				businessId: '',
				reasonShow: false,
				timeShow: false,
				reasonName: '',
				vehicle: {},
				reasonList: [],
				addbean: {
					carId: '',
					id: '',
					disposalReason: '',
					disposalTime: '',
					remark: '',
					attachment: [],
				}
			}
		},
		computed: {
			dataBean() {
				return {
					vehicle: this.vehicle
				}
			}
		},
		methods: {
			pickerShow(type) {
				switch (type) {
					case 1:
						this.reasonShow = true;
						// this.mode = 'selector';
						break
					case 2:
						this.timeShow = true;
						// this.mode = 'time';
						break
				}
			},
			pickerConfim(e) {
				this.reasonShow = false;
				// let index = e;
				this.addbean.disposalReason = e.value[0].code;
				this.reasonName = e.value[0].value;
			},

			timeconfirm(e) {

				let timeStr = uni.$u.timeFormat(e.value, 'yyyy-mm-dd');

				this.timeShow = false;
				this.addbean.disposalTime = timeStr;
			},

			onListChange(tag, list, objList) {

				console.log('结果list', list);
				console.log('结果objList', objList);

				// if (tag == 1) {
				this.addbean.attachment = objList;
				// }

			},

			commit() {
				if (uni.$u.test.isEmpty(this.addbean.disposalReason)) {
					this.$u.toast('请选择处置原因');
					return
				}
				if (uni.$u.test.isEmpty(this.addbean.disposalTime)) {
					this.$u.toast('请选择处置时间');
					return
				}

				let that = this;

				uni.showModal({
					content: '确定提交吗？',
					success(res) {
						if (res.confirm) {

							that.$u.api.carDisposalSave(that.addbean).then(
								res => {
									uni.showToast({
										title: '提交成功',
										icon: 'none'
									});
									setTimeout(()=>{
										uni.navigateBack()
									}, 1000)
								}
							);


						}
					}
				})
			}

		},
		onLoad(op) {
      let that = this

			this.pageType = op.pageType;
			this.carId = op.carId;
			this.businessId = op.businessId;

			this.addbean.carId = op.carId;
			this.addbean.id = op.businessId;

			if ('add' == this.pageType) {
				uni.setNavigationBarTitle({
					title: '新增车辆处置信息'
				})
			} else {
				uni.setNavigationBarTitle({
					title: '编辑车辆处置信息'
				})
			}

			this.vehicle = getApp().globalData.vehicle
			getApp().globalData.vehicle = {}
			
			this.reasonList = [this.$store.state.params.getCarCommon.disposalReasonList]

			if (!uni.$u.test.isEmpty(this.businessId)) {
				//获取编辑回显信息
				this.$u.api.carDisposalDetail({
					carId: this.carId,
					businessId: this.businessId
				}).then(res => {
					this.vehicle = res.vehicle
					this.addbean.disposalReason = res.carDisposal.disposalReason

					// for (let s of this.$store.state.params.getCarCommon.disposalReasonList) {
					// 	if (s.code == res.carDisposal.disposalReason) {
					// 		this.reasonName = s.value;
					// 		break;
					// 	}
					// }
          this.reasonName = res.carDisposal.disposalReason;

					this.addbean.disposalTime = res.carDisposal.disposalTime
					this.addbean.remark = res.carDisposal.remark
					this.addbean.attachment = res.carDisposal.attachment

          if(!uni.$u.test.isEmpty(res.carDisposal.attachment)){

            this.$refs.upload1.fileList1=res.carDisposal.attachment.filter(item => {
              return 1== item.type_file||1==item.typeFile
            }).map(item=>{
                return {
                  ...item,
                  message: "",
                  size: 52363,
                  status: "success",
                  thumb: that.baseImgUrl()+item.url,
                  type: isVideo(item.url),
                  url: item.url
                }
            })

            console.log('最终数据', this.$refs.upload1.fileList1)
          }
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.bottom {
		position: fixed;
		width: 100%;
		height: 100rpx;
		bottom: 0;
		z-index: 999;
		background-color: white;
		display: flex;
		align-items: center;
		justify-content: center;

		text {
			width: 98%;
			height: 80rpx;
			line-height: 80rpx;
			border-radius: 50rpx;
			background-color: $blue15;
			color: white;
			text-align: center;
			font-size: 30rpx;
		}
	}
</style>
